import { Button, Form, Input, Modal } from "antd";
import React from "react";

export default function DataTextDetailBtn({
  data,
  onDataChange,
}:{
  data: string;
  onDataChange: (data: string)=>void
}){
  const [form] = Form.useForm<{data: string}>();

  return <Button
    onClick={() => {
      form.setFieldsValue({
        data,
      })
      Modal.confirm({
        title: '数据详情',
        content: (
          <Form form={form}>
            <Form.Item name="data">
              <Input.TextArea
                autoSize={{ minRows: 5, maxRows: 30 }}
              />
            </Form.Item>
          </Form>
        ),
        width: 600,
        okText: '保存',
        onOk: ()=>{
          onDataChange(form.getFieldsValue().data);
        }
      });
    }}
  >
    详情
  </Button>
}
